import React from 'react';
import {Svg, G, Defs, Path, ClipPath, Rect} from 'react-native-svg';
import {BasicsProps} from './type';

type Props = {
  color?: string;
} & BasicsProps;

const CollectionIcon = ({size = '36', color = '#fff'}: Props): JSX.Element => {
  return (
    <Svg width={size} height={size} viewBox="0 0 36 36" fill="none">
      <G
        id="&#232;&#191;&#189;&#229;&#137;&#167;icon"
        clip-path="url(#clip0_36_367)">
        <G id="Star 1" filter="url(#filter0_d_36_367)">
          <Path
            d="M17.0489 2.92705C17.3483 2.00574 18.6517 2.00574 18.9511 2.92705L21.8167 11.7467C21.9506 12.1587 22.3346 12.4377 22.7678 12.4377H32.0413C33.0101 12.4377 33.4128 13.6773 32.6291 14.2467L25.1267 19.6976C24.7762 19.9522 24.6295 20.4036 24.7634 20.8156L27.6291 29.6353C27.9284 30.5566 26.874 31.3227 26.0902 30.7533L18.5878 25.3024C18.2373 25.0478 17.7627 25.0478 17.4122 25.3024L9.90976 30.7533C9.12605 31.3227 8.07157 30.5566 8.37092 29.6353L11.2366 20.8156C11.3705 20.4036 11.2238 19.9522 10.8733 19.6976L3.37088 14.2467C2.58717 13.6773 2.98994 12.4377 3.95867 12.4377H13.2322C13.6654 12.4377 14.0494 12.1587 14.1833 11.7467L17.0489 2.92705Z"
            fill={color}
          />
        </G>
      </G>
      <Defs>
        <ClipPath id="clip0_36_367">
          <Rect width="36" height="36" fill="white" />
        </ClipPath>
      </Defs>
    </Svg>
  );
};

export default CollectionIcon;
